<template>

	<div style="margin-bottom: 5px; text-align: right">
    <div  style="display: inline-block; margin-top:5px;margin-bottom:5px; margin-right:100px">
      <el-input style="width: 200px;" class="w-50 m-2" v-model="name1" placeholder="请输入账号" clearable>
      </el-input>
      <el-button id="41"  @click="search" style="margin-left: 5px">搜索</el-button>
    </div>
		<el-scrollbar>
			<el-table :data="tableData"  height="450" stripe style="width: 100%"
				>
<!--        :header-cell-style="{background:'#545c64',color:'#ffd04b'}" border-->
        <el-table-column
            label="序号"
            type="index"
            width="80"
            align="center">
          <template v-slot="scope">
            <span>{{(currentPage - 1) * pageSize + scope.$index + 1}}</span>
          </template>
        </el-table-column>
				<el-table-column prop="uid" label="账号" align="center" />
				<el-table-column prop="userName" label="用户名" align="center" />
				<el-table-column prop="phone" label="电话" align="center" />
				<el-table-column prop="isLogin" label="允许登录" width="150" align="center">
<!--					<el-switch v-model="value" />-->
          <template v-slot="scope">
            <el-switch v-model="scope.row.isLogin" active-value="1" inactive-value="0"
                       @change="setLogin(scope.row.userName,scope.row.isLogin)"/>
          </template>

				</el-table-column>

			</el-table>

		</el-scrollbar>
    <div class='block'>
      <el-pagination
          background
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[5, 10, 20, 40]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
      >
      </el-pagination>
    </div>
	</div>
</template>

<script>
	import {
		ref
	} from 'vue'
	import request from "@/util/request"


	export default {
		name: "LoginAuthorityMain",
		data() {
			return {

        pageSize:10,
        currentPage:1,
        total:13,

				tableData: [],

				name1:'',
				value:ref(true),
				centerDialogVisible:false,
				form:{
					tenantName:'',
					fee:'0',
					id:'',
					password:'',
					phone:''
				}
				/*pageSize:4,
				pageNum:1,
				total:0*/
			}
		},
		methods: {
      search(){
        document.getElementById("41").blur();
        this.loadPost()
      },
      handleCurrentChange(val){
        console.log(`${val} items per page`)
        this.currentPage=val
        this.loadGet()
      },
			loadGet() {

				request.get('http://localhost:8090/user/showAllUser').then(res => res.data).then(res => {
					this.tableData = res.data[this.currentPage-1].records
          this.total=res.data[this.currentPage-1].total
          console.log(res)
				})
			},
      setLogin(userName,isLogin){
        let config = {
           headers:{
             "Content-Type":"multipart/form-data"
           }
        };
         let formData = new FormData();
         formData.append("userName",userName);
        formData.append("isLogin",isLogin);

        console.log("islogin---"+isLogin)
        console.log("islogin+++++"+userName)
        request.post('http://localhost:8090/user/setIsLogin',formData,config)
      },
			loadPost() {
        console.log("name" + this.name1)
        let config = {
          headers:{
            "Content-Type":"multipart/form-data"
          }
        };
        let formData = new FormData();
        formData.append("userName",this.name1);
        request.post('http://localhost:8090/user/findAllUserByLike',formData,config).then(res => res.data).then(res => {
					this.tableData = res.data[0].records

				})
			},
		},

		beforeMount() {
			this.loadGet()

		}

	}
</script>


<style>
</style>
